<!DOCTYPE html><html class=split lang=en-US-x-hixie><script src=../link-fixup.js defer=""></script>
<!-- Mirrored from html.spec.whatwg.org/dev/embedded-content-other.html by HTTrack Website Copier/3.x [XR&CO'2014], Wed, 10 Sep 2025 08:36:26 GMT -->
<!-- Added by HTTrack --><meta http-equiv="content-type" content="text/html;charset=utf-8" /><!-- /Added by HTTrack -->
<meta charset=utf-8><meta content="width=device-width, initial-scale=1, shrink-to-fit=no" name=viewport><title>HTML Standard, Edition for Web Developers</title><meta content=#3c790a name=theme-color><meta content="light dark" name=color-scheme><link rel=stylesheet href=../../resources.whatwg.org/standard-shared-with-dev.css crossorigin=""><link rel=icon href=https://resources.whatwg.org/logo.svg crossorigin=""><link rel=stylesheet href=styles.css crossorigin=""><script>
   function toggleStatus(div) {
     div.parentNode.classList.toggle('wrapped');
   }
   function setLinkFragment(link) {
     link.hash = location.hash;
   }
  </script><body>
  <script async="" src=search.js></script>
  
  
  <header id=head class="head with-buttons">
   <a href=https://whatwg.org/ class=logo><img width=100 alt=WHATWG crossorigin="" class=darkmode-aware src=https://resources.whatwg.org/logo.svg height=100></a>
   
   <hgroup><h1><a rel=home href=index.html>HTML: The Living Standard</a></h1><p id=dev-edition-h2>Edition for Web Developers — Last Updated <span class=pubdate>10 September 2025</span></hgroup>
   

   <div id=search>
    <input placeholder="Search. Press '/'" autocomplete=off name=query id=query type=search>
    <ol id=results></ol>
   </div>
  </header>

  

  

  

  
  

  
  

  

  <nav><a href=image-maps.html>← 4.8.12 The map element</a> — <a href=index.html>Table of Contents</a> — <a href=tables.html>4.9 Tabular data →</a></nav><ol class=toc><li><ol><li><ol><li><a href=embedded-content-other.html#mathml><span class=secno>4.8.15</span> MathML</a><li><a href=embedded-content-other.html#svg-0><span class=secno>4.8.16</span> SVG</a><li><a href=embedded-content-other.html#dimension-attributes><span class=secno>4.8.17</span> Dimension attributes</a></ol></ol></ol><h4 id=mathml><span class=secno>4.8.15</span> MathML<a href=#mathml class=self-link></a></h4><div class="mdn-anno wrapped"><button onclick=toggleStatus(this) class=mdn-anno-btn><b title="Support in all current engines." class=all-engines-flag>✔</b><span>MDN</span></button><div class=feature><p><a href=https://developer.mozilla.org/en-US/docs/Web/Guide/HTML/HTML5/HTML5_Parser#Inline_SVG_and_MathML_support title="To build websites, you should know about HTML — the fundamental technology used to define the structure of a webpage. HTML is used to specify whether your web content should be recognized as a paragraph, list, heading, link, image, multimedia player, form, or one of many other available elements or even a new element that you define.">HTML/HTML5/HTML5_Parser#Inline_SVG_and_MathML_support</a><p class=all-engines-text>Support in all current engines.<div class=support><span class="firefox yes"><span>Firefox</span><span>4+</span></span><span class="safari yes"><span>Safari</span><span>5.1+</span></span><span class="chrome yes"><span>Chrome</span><span>7+</span></span><hr><span class="opera yes"><span>Opera</span><span>11.6+</span></span><span class="edge_blink yes"><span>Edge</span><span>79+</span></span><hr><span class="edge yes"><span>Edge (Legacy)</span><span>12+</span></span><span class="ie yes"><span>Internet Explorer</span><span>9+</span></span><hr><span class="firefox_android yes"><span>Firefox Android</span><span>5+</span></span><span class="safari_ios yes"><span>Safari iOS</span><span>5+</span></span><span class="chrome_android yes"><span>Chrome Android</span><span>18+</span></span><span class="webview_android yes"><span>WebView Android</span><span>3+</span></span><span class="samsunginternet_android yes"><span>Samsung Internet</span><span>1.0+</span></span><span class="opera_android yes"><span>Opera Android</span><span>12+</span></span></div></div></div>

  <p>The <a id=mathml:mathml-math href=https://w3c.github.io/mathml-core/#the-top-level-math-element data-x-internal=mathml-math>MathML <code>math</code></a> element falls into the <a id=mathml:embedded-content-category href=dom.html#embedded-content-category>embedded content</a>,
  <a id=mathml:phrasing-content-2 href=dom.html#phrasing-content-2>phrasing content</a>, <a id=mathml:flow-content-2 href=dom.html#flow-content-2>flow content</a>, and <a id=mathml:palpable-content-2 href=dom.html#palpable-content-2>palpable content</a>
  categories for the purposes of the content models in this specification.</p>

  <p>When the <a id=mathml:mathml-annotation-xml href=https://w3c.github.io/mathml-core/#dfn-annotation-xml data-x-internal=mathml-annotation-xml>MathML <code>annotation-xml</code></a> element contains elements from the
  <a id=mathml:html-namespace-2 href=https://infra.spec.whatwg.org/#html-namespace data-x-internal=html-namespace-2>HTML namespace</a>, such elements must all be <a id=mathml:flow-content-2-2 href=dom.html#flow-content-2>flow content</a>.</p>

  <p>When the MathML token elements (<code id=mathml:mathml-mi><a data-x-internal=mathml-mi href=https://w3c.github.io/mathml-core/#the-mi-element>mi</a></code>, <code id=mathml:mathml-mo><a data-x-internal=mathml-mo href=https://w3c.github.io/mathml-core/#operator-fence-separator-or-accent-mo>mo</a></code>, <code id=mathml:mathml-mn><a data-x-internal=mathml-mn href=https://w3c.github.io/mathml-core/#number-mn>mn</a></code>, <code id=mathml:mathml-ms><a data-x-internal=mathml-ms href=https://w3c.github.io/mathml-core/#string-literal-ms>ms</a></code>, and <code id=mathml:mathml-mtext><a data-x-internal=mathml-mtext href=https://w3c.github.io/mathml-core/#text-mtext>mtext</a></code>) are descendants of HTML elements, they may contain
  <a id=mathml:phrasing-content-2-2 href=dom.html#phrasing-content-2>phrasing content</a> elements from the <a id=mathml:html-namespace-2-2 href=https://infra.spec.whatwg.org/#html-namespace data-x-internal=html-namespace-2>HTML namespace</a>.</p>
  

  

  <p>The semantics of MathML elements are defined by <cite>MathML</cite> and <a id=mathml:other-applicable-specifications href=infrastructure.html#other-applicable-specifications>other applicable
  specifications</a>. <a href=references.html#refsMATHML>[MATHML]</a></p>

  <div class=example>

   <p>Here is an example of the use of MathML in an HTML document:</p>

   <pre><code class='html'><c- cp>&lt;!DOCTYPE html&gt;</c->
<c- p>&lt;</c-><c- f>html</c-> <c- e>lang</c-><c- o>=</c-><c- s>&quot;en&quot;</c-><c- p>&gt;</c->
 <c- p>&lt;</c-><c- f>head</c-><c- p>&gt;</c->
  <c- p>&lt;</c-><c- f>title</c-><c- p>&gt;</c->The quadratic formula<c- p>&lt;/</c-><c- f>title</c-><c- p>&gt;</c->
 <c- p>&lt;/</c-><c- f>head</c-><c- p>&gt;</c->
 <c- p>&lt;</c-><c- f>body</c-><c- p>&gt;</c->
  <c- p>&lt;</c-><c- f>h1</c-><c- p>&gt;</c->The quadratic formula<c- p>&lt;/</c-><c- f>h1</c-><c- p>&gt;</c->
  <c- p>&lt;</c-><c- f>p</c-><c- p>&gt;</c->
   <c- p>&lt;</c-><c- f>math</c-><c- p>&gt;</c->
    <c- p>&lt;</c-><c- f>mi</c-><c- p>&gt;</c->x<c- p>&lt;/</c-><c- f>mi</c-><c- p>&gt;</c->
    <c- p>&lt;</c-><c- f>mo</c-><c- p>&gt;</c->=<c- p>&lt;/</c-><c- f>mo</c-><c- p>&gt;</c->
    <c- p>&lt;</c-><c- f>mfrac</c-><c- p>&gt;</c->
     <c- p>&lt;</c-><c- f>mrow</c-><c- p>&gt;</c->
      <c- p>&lt;</c-><c- f>mo</c-> <c- e>form</c-><c- o>=</c-><c- s>&quot;prefix&quot;</c-><c- p>&gt;</c->−<c- p>&lt;/</c-><c- f>mo</c-><c- p>&gt;</c-> <c- p>&lt;</c-><c- f>mi</c-><c- p>&gt;</c->b<c- p>&lt;/</c-><c- f>mi</c-><c- p>&gt;</c->
      <c- p>&lt;</c-><c- f>mo</c-><c- p>&gt;</c->±<c- p>&lt;/</c-><c- f>mo</c-><c- p>&gt;</c->
      <c- p>&lt;</c-><c- f>msqrt</c-><c- p>&gt;</c->
       <c- p>&lt;</c-><c- f>msup</c-><c- p>&gt;</c-> <c- p>&lt;</c-><c- f>mi</c-><c- p>&gt;</c->b<c- p>&lt;/</c-><c- f>mi</c-><c- p>&gt;</c-> <c- p>&lt;</c-><c- f>mn</c-><c- p>&gt;</c->2<c- p>&lt;/</c-><c- f>mn</c-><c- p>&gt;</c-> <c- p>&lt;/</c-><c- f>msup</c-><c- p>&gt;</c->
       <c- p>&lt;</c-><c- f>mo</c-><c- p>&gt;</c->−<c- p>&lt;/</c-><c- f>mo</c-><c- p>&gt;</c->
       <c- p>&lt;</c-><c- f>mn</c-><c- p>&gt;</c->4<c- p>&lt;/</c-><c- f>mn</c-><c- p>&gt;</c-> <c- p>&lt;</c-><c- f>mo</c-><c- p>&gt;</c->⁢<c- p>&lt;/</c-><c- f>mo</c-><c- p>&gt;</c-> <c- p>&lt;</c-><c- f>mi</c-><c- p>&gt;</c->a<c- p>&lt;/</c-><c- f>mi</c-><c- p>&gt;</c-> <c- p>&lt;</c-><c- f>mo</c-><c- p>&gt;</c->⁢<c- p>&lt;/</c-><c- f>mo</c-><c- p>&gt;</c-> <c- p>&lt;</c-><c- f>mi</c-><c- p>&gt;</c->c<c- p>&lt;/</c-><c- f>mi</c-><c- p>&gt;</c->
      <c- p>&lt;/</c-><c- f>msqrt</c-><c- p>&gt;</c->
     <c- p>&lt;/</c-><c- f>mrow</c-><c- p>&gt;</c->
     <c- p>&lt;</c-><c- f>mrow</c-><c- p>&gt;</c->
      <c- p>&lt;</c-><c- f>mn</c-><c- p>&gt;</c->2<c- p>&lt;/</c-><c- f>mn</c-><c- p>&gt;</c-> <c- p>&lt;</c-><c- f>mo</c-><c- p>&gt;</c->⁢<c- p>&lt;/</c-><c- f>mo</c-><c- p>&gt;</c-> <c- p>&lt;</c-><c- f>mi</c-><c- p>&gt;</c->a<c- p>&lt;/</c-><c- f>mi</c-><c- p>&gt;</c->
     <c- p>&lt;/</c-><c- f>mrow</c-><c- p>&gt;</c->
    <c- p>&lt;/</c-><c- f>mfrac</c-><c- p>&gt;</c->
   <c- p>&lt;/</c-><c- f>math</c-><c- p>&gt;</c->
  <c- p>&lt;/</c-><c- f>p</c-><c- p>&gt;</c->
 <c- p>&lt;/</c-><c- f>body</c-><c- p>&gt;</c->
<c- p>&lt;/</c-><c- f>html</c-><c- p>&gt;</c-></code></pre>

  </div>



  <h4 id=svg-0><span class=secno>4.8.16</span> SVG<a href=#svg-0 class=self-link></a></h4><div class="mdn-anno wrapped"><button onclick=toggleStatus(this) class=mdn-anno-btn><b title="Support in all current engines." class=all-engines-flag>✔</b><span>MDN</span></button><div class=feature><p><a href=https://developer.mozilla.org/en-US/docs/Web/Guide/HTML/HTML5/HTML5_Parser#Inline_SVG_and_MathML_support title="To build websites, you should know about HTML — the fundamental technology used to define the structure of a webpage. HTML is used to specify whether your web content should be recognized as a paragraph, list, heading, link, image, multimedia player, form, or one of many other available elements or even a new element that you define.">HTML/HTML5/HTML5_Parser#Inline_SVG_and_MathML_support</a><p class=all-engines-text>Support in all current engines.<div class=support><span class="firefox yes"><span>Firefox</span><span>37+</span></span><span class="safari yes"><span>Safari</span><span>11.1+</span></span><span class="chrome yes"><span>Chrome</span><span>7+</span></span><hr><span class="opera yes"><span>Opera</span><span>15+</span></span><span class="edge_blink yes"><span>Edge</span><span>79+</span></span><hr><span class="edge yes"><span>Edge (Legacy)</span><span>12+</span></span><span class="ie yes"><span>Internet Explorer</span><span>10+</span></span><hr><span class="firefox_android yes"><span>Firefox Android</span><span>37+</span></span><span class="safari_ios yes"><span>Safari iOS</span><span>11.3+</span></span><span class="chrome_android yes"><span>Chrome Android</span><span>18+</span></span><span class="webview_android yes"><span>WebView Android</span><span>4.4+</span></span><span class="samsunginternet_android yes"><span>Samsung Internet</span><span>4+</span></span><span class="opera_android yes"><span>Opera Android</span><span>15+</span></span></div></div></div>

  <p>The <a id=svg-0:svg-svg href=https://svgwg.org/svg2-draft/struct.html#SVGElement data-x-internal=svg-svg>SVG <code>svg</code></a> element falls into the <a id=svg-0:embedded-content-category href=dom.html#embedded-content-category>embedded content</a>,
  <a id=svg-0:phrasing-content-2 href=dom.html#phrasing-content-2>phrasing content</a>, <a id=svg-0:flow-content-2 href=dom.html#flow-content-2>flow content</a>, and <a id=svg-0:palpable-content-2 href=dom.html#palpable-content-2>palpable content</a>
  categories for the purposes of the content models in this specification.</p>

  <p>When the <a id=svg-0:svg-foreignobject href=https://svgwg.org/svg2-draft/embedded.html#ForeignObjectElement data-x-internal=svg-foreignobject>SVG <code>foreignObject</code></a> element contains elements from the
  <a id=svg-0:html-namespace-2 href=https://infra.spec.whatwg.org/#html-namespace data-x-internal=html-namespace-2>HTML namespace</a>, such elements must all be <a id=svg-0:flow-content-2-2 href=dom.html#flow-content-2>flow content</a>.</p>

  <p>The content model for the <a id=svg-0:svg-title href=https://svgwg.org/svg2-draft/struct.html#TitleElement data-x-internal=svg-title>SVG <code>title</code></a> element inside <a id=svg-0:html-documents href=https://dom.spec.whatwg.org/#html-document data-x-internal=html-documents>HTML
  documents</a> is <a id=svg-0:phrasing-content-2-2 href=dom.html#phrasing-content-2>phrasing content</a>. (This further constrains the requirements given
  in <cite>SVG 2</cite>.)</p>

  <p>The semantics of SVG elements are defined by <cite>SVG 2</cite> and <a id=svg-0:other-applicable-specifications href=infrastructure.html#other-applicable-specifications>other applicable
  specifications</a>. <a href=references.html#refsSVG>[SVG]</a></p>

  <hr>

  <dl class=domintro><dt><code><var>doc</var> = <var>iframe</var>.<span id=dom-media-getsvgdocument>getSVGDocument</span>()</code><dt><code><var>doc</var> = <var>embed</var>.<a href=#dom-media-getsvgdocument id=svg-0:dom-media-getsvgdocument>getSVGDocument</a>()</code><dt><code><var>doc</var> = <var>object</var>.<a href=#dom-media-getsvgdocument id=svg-0:dom-media-getsvgdocument-2>getSVGDocument</a>()</code><dd><p>Returns the <code>Document</code> object, in the case of <code id=svg-0:the-iframe-element><a href=iframe-embed-object.html#the-iframe-element>iframe</a></code>,
   <code id=svg-0:the-embed-element><a href=iframe-embed-object.html#the-embed-element>embed</a></code>, or <code id=svg-0:the-object-element><a href=iframe-embed-object.html#the-object-element>object</a></code> elements being used to embed SVG.</dl>

  



  <h4 id=dimension-attributes><span class=secno>4.8.17</span> <dfn>Dimension attributes</dfn><a href=#dimension-attributes class=self-link></a></h4>

  <p> The <dfn data-dfn-for=img,iframe,embed,object,source,video id=attr-dim-width data-dfn-type=element-attr><code>width</code></dfn> and
  <dfn data-dfn-for=img,iframe,embed,object,source,video id=attr-dim-height data-dfn-type=element-attr><code>height</code></dfn> attributes on <code id=dimension-attributes:the-img-element><a href=embedded-content.html#the-img-element>img</a></code>, <code id=dimension-attributes:the-iframe-element><a href=iframe-embed-object.html#the-iframe-element>iframe</a></code>,
  <code id=dimension-attributes:the-embed-element><a href=iframe-embed-object.html#the-embed-element>embed</a></code>, <code id=dimension-attributes:the-object-element><a href=iframe-embed-object.html#the-object-element>object</a></code>, <code id=dimension-attributes:the-video-element><a href=media.html#the-video-element>video</a></code>, <code id=dimension-attributes:the-source-element><a href=embedded-content.html#the-source-element>source</a></code> when the parent
  is a <code id=dimension-attributes:the-picture-element><a href=embedded-content.html#the-picture-element>picture</a></code> element and, when their <code id=dimension-attributes:attr-input-type><a href=input.html#attr-input-type>type</a></code>
  attribute is in the <a href="input.html#image-button-state-(type=image)" id="dimension-attributes:image-button-state-(type=image)">Image Button</a> state,
  <code id=dimension-attributes:the-input-element><a href=input.html#the-input-element>input</a></code> elements may be specified to give the dimensions of the visual content of the
  element (the width and height respectively, relative to the nominal direction of the output
  medium), in <a href=https://drafts.csswg.org/css-values/#px id="dimension-attributes:'px'" data-x-internal="'px'">CSS pixels</a>. The attributes, if specified, must have values
  that are <a href=common-microsyntaxes.html#valid-non-negative-integer id=dimension-attributes:valid-non-negative-integer>valid non-negative integers</a>.</p>

  <p>The specified dimensions given may differ from the dimensions specified in the resource itself,
  since the resource may have a resolution that differs from the CSS pixel resolution. (On screens,
  <a href=https://drafts.csswg.org/css-values/#px id="dimension-attributes:'px'-2" data-x-internal="'px'">CSS pixels</a> have a resolution of 96ppi, but in general the CSS pixel
  resolution depends on the reading distance.) If both attributes are specified, then one of the
  following statements must be true:</p>

  <ul><li><var>specified width</var> - 0.5 ≤
             <var>specified height</var> * <var>target ratio</var> ≤
             <var>specified width</var> + 0.5<li><var>specified height</var> - 0.5 ≤
             <var>specified width</var> / <var>target ratio</var> ≤
             <var>specified height</var> + 0.5<li><var>specified height</var> = <var>specified width</var> = 0</ul>

  <p>The <var>target ratio</var> is the ratio of the <a id=dimension-attributes:natural-width href=https://drafts.csswg.org/css-images/#natural-width data-x-internal=natural-width>natural width</a> to the
  <a id=dimension-attributes:natural-height href=https://drafts.csswg.org/css-images/#natural-height data-x-internal=natural-height>natural height</a> in the resource. The <var>specified width</var> and <var>specified
  height</var> are the values of the <code id=dimension-attributes:attr-dim-width><a href=#attr-dim-width>width</a></code> and <code id=dimension-attributes:attr-dim-height><a href=#attr-dim-height>height</a></code> attributes respectively.</p>

  <p>The two attributes must be omitted if the resource in question does not have both a
  <a id=dimension-attributes:natural-width-2 href=https://drafts.csswg.org/css-images/#natural-width data-x-internal=natural-width>natural width</a> and a <a id=dimension-attributes:natural-height-2 href=https://drafts.csswg.org/css-images/#natural-height data-x-internal=natural-height>natural height</a>.</p>

  <p>If the two attributes are both 0, it indicates that the element is not intended for the user
  (e.g. it might be a part of a service to count page views).</p>

  <p class=note>The dimension attributes are not intended to be used to stretch the image.</p>

  



  <nav><a href=image-maps.html>← 4.8.12 The map element</a> — <a href=index.html>Table of Contents</a> — <a href=tables.html>4.9 Tabular data →</a></nav>
